var currentWatcher = null;
class Watcher{
    constructor(obj,key,callback){
        this.obj = obj;
        this.key = key;
        this.callback = callback;
    }
}

//把obj对象的key属性变成响应式的
function defineReactive(obj,key,value){
  //存放obj对象的key属性的所有的观察者
  const watchers = [];  
 //重新定义obj对象的属性，属性描述符 getter setter
 Object.defineProperty(obj,key,{
    get(){
        //把此watcher添加到数组里，也就是监听obj的key的属性变化
        watchers.push(currentWatcher);
        return value;
    },
    set(newValue){
        watchers.forEach(watcher=>watcher.callback(newValue,value));
        value=newValue;
    }
 });
}
//负责把obj对象变成响应式的，也就是说当给对象的属性赋值的时候，会执行update函数
function observe(obj){
   const entries = Object.entries(obj);
   entries.forEach(([key,value])=>{
    defineReactive(obj,key,value);
   });
}
let data = {message:'hello'};
//观察data对象，让data对象的属性变成响应式的
observe(data);
//创建一个观察者的实例，观察data对象key属性的变化，当属性变化后执行对应回调函数
currentWatcher = new Watcher(data,'message',(newValue,oldValue)=>{
    console.log(`监控的值发生了变化，页面重新渲染`,oldValue,newValue);
});
console.log(data.message)
data.message='world';